<!doctype html>
<html lang="en">
  <head>
    <%= htmlWebpackPlugin.options.tags.head %>
    <!-- 页面css -->
    <link rel="stylesheet" href="./css/articleDetailHtml.css" />
  </head>

  <body>
    <div class="page">
      <header class="page-header">
        <div class="page-header-nav box-shadow-bottom">
          <div class="header-nav-left">
            <span class="glyphicon glyphicon-menu-left nav-back-btn" onclick="router.back()"></span>
          </div>
          <div class="header-nav-title">News Details</div>
        </div>
      </header>
      <!-- 内容主体 -->
      <main class="page-main">
        <div class="padding-10 bg-regular">
          <div class="flex-column margin-top-10">
            <div class="justify-between align-end">
              <div class="flex">
                <img class="width-height-30 margin-right-10" src="./images/ball_park.png" alt="" srcset="" />
                <div class="flex-column">
                  <div class="font-size-min">Alxe</div>
                  <span class="text-color-secondary font-size-s">Today 16:32</span>
                </div>
              </div>
              <div class="align-center text-color-secondary">
                <div class="align-center margin-right-20">
                  <img class="width-height-15" src="./images/message_icon.png" alt="" srcset="" />
                  <span class="margin-left-5">0</span>
                </div>
                <div class="align-center">
                  <img class="width-height-15" :src="index==0 ? './images/thumbs_up_.png' : './images/thumbs_up.png'" alt="" srcset="" />
                  <span class="margin-left-5">0</span>
                </div>
              </div>
            </div>

            <div class="font-size-s margin-top-10 margin-bottom-15">
              “If he misses, I kill him,” he laughed. “He has a very good shot, he has a lot of quality and personality. If he doesn’t give it to Vini or Bellingham and he scores, everyone will be
              quiet.”
            </div>
          </div>
        </div>

        <div class="bg-regular padding-10 margin-top-10">
          <div class="margin-top-10 margin-bottom-20">latest comments 2</div>
          <div class="flex-column"><%= htmlWebpackPlugin.options.tags.commentsReplayer %></div>
        </div>
      </main>

      <footer class="page-footer">
        <div class="padding-10 bg-regular justify-between align-center box-shadow-top">
          <a class="flex-1 bg-primary radius-huge padding-10 margin-right-10 text-color-secondary" href="editReply.html">Add a comment</a>
        </div>
      </footer>
    </div>

    <%= htmlWebpackPlugin.options.tags.foot %>
  </body>
</html>
